<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/head.css">
    <link rel="stylesheet" href="css/content.css">
    <link rel="stylesheet" href="css/skin/skin_0.css" id="sheet-color">

    <script src="js/jquery.js"></script>
    <script src="js/jquery.cookie.js"></script>
    <script src="js/index.js"></script>

</head>
<body>
    <header id="header">
        <div id="top">
            <a id="logo"><img src="images/logo.gif" alt=""></a>
            <div id="search"><input type="text" value="请输入商品名称"></div>
            <div id="nav-color">
                <ul id="skin">
                    <li id="skin_0" title="灰色" class="selected">灰色</li>
                    <li id="skin_1" title="淡绿色">淡绿色</li>
                    <li id="skin_2" title="橙色">橙色</li>
                    <li id="skin_3" title="天蓝色">天蓝色</li>
                    <li id="skin_4" title="红色">红色</li>
                    <li id="skin_5" title="紫色">紫色</li>
                </ul>
            </div>
        </div>
        <div id="nav">
            <ul>
                <li class="title"><a href="#">首页</a></li>
                <li class="title">
                    <a href="#">品牌</a>
                    <div class="hide-nav" >
                        <dl class="fore">
                            <dt>
                                <a href="#nogo" class="band">品牌：</a>
                            </dt>
                            <dd>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em ><a href="#nogo">安踏</a></em>
                                <em ><a href="#nogo">奥康</a></em>
                                <em ><a href="#nogo">骆驼</a></em>
                                <em ><a href="#nogo">特步</a></em>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em class="noborder"><a href="#nogo">特步</a></em>
                            </dd>
                        </dl>
                        <dl >
                            <dt>
                                <a href="#nogo" class="band">品牌：</a>
                            </dt>
                            <dd>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em ><a href="#nogo">安踏</a></em>
                                <em ><a href="#nogo">奥康</a></em>
                                <em ><a href="#nogo">骆驼</a></em>
                                <em ><a href="#nogo">特步</a></em>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em class="noborder"><a href="#nogo">特步</a></em>
                            </dd>
                        </dl>

                    </div>
                </li>
                <li class="title">
                    <a href="#">女装</a>
                    <div class="hide-nav" >
                        <dl class="fore">
                            <dt>
                                <a href="#nogo" class="band">品牌：</a>
                            </dt>
                            <dd>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em ><a href="#nogo">安踏</a></em>
                                <em ><a href="#nogo">奥康</a></em>
                                <em ><a href="#nogo">骆驼</a></em>
                                <em ><a href="#nogo">特步</a></em>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em class="noborder"><a href="#nogo">特步</a></em>
                            </dd>
                        </dl>
                        <dl >
                            <dt>
                                <a href="#nogo" class="band">品牌：</a>
                            </dt>
                            <dd>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em ><a href="#nogo">安踏</a></em>
                                <em ><a href="#nogo">奥康</a></em>
                                <em ><a href="#nogo">骆驼</a></em>
                                <em ><a href="#nogo">特步</a></em>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em class="noborder"><a href="#nogo">特步</a></em>
                            </dd>
                        </dl>

                    </div>
                </li>
                <li class="title">
                    <a href="#">男装</a>
                    <div class="hide-nav" >
                        <dl class="fore">
                            <dt>
                                <a href="#nogo" class="band">品牌：</a>
                            </dt>
                            <dd>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em ><a href="#nogo">安踏</a></em>
                                <em ><a href="#nogo">奥康</a></em>
                                <em ><a href="#nogo">骆驼</a></em>
                                <em ><a href="#nogo">特步</a></em>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em class="noborder"><a href="#nogo">特步</a></em>
                            </dd>
                        </dl>
                        <dl >
                            <dt>
                                <a href="#nogo" class="band">品牌：</a>
                            </dt>
                            <dd>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em ><a href="#nogo">安踏</a></em>
                                <em ><a href="#nogo">奥康</a></em>
                                <em ><a href="#nogo">骆驼</a></em>
                                <em ><a href="#nogo">特步</a></em>
                                <em ><a href="#nogo">耐克</a></em>
                                <em ><a href="#nogo">阿迪达斯</a></em>
                                <em ><a href="#nogo">达芙妮</a></em>
                                <em ><a href="#nogo">李宁</a></em>
                                <em class="noborder"><a href="#nogo">特步</a></em>
                            </dd>
                        </dl>

                    </div>
                </li >
                <li class="title"><a href="#">鞋包配饰</a></li>
            </ul>
        </div>
    </header>
    <div id="content">
        <div id="content-left">
            <div id="content-title"><h2>商品分类</h2></div>
            <div id="content-left-list">

                <h3>推荐品牌</h3>
                <ul>
                    <li><a href="###" >耐克</a></li>
                    <li><a href="###" class="promoted">阿迪达斯 <span></span></a></li>
                    <li><a href="###" >达芙妮</a></li>
                    <li><a href="###" >李宁</a></li>
                    <li><a href="###" >安踏</a></li>
                    <li><a href="###" >奥康</a></li>
                    <li><a href="###" class="promoted">骆驼 <span></span></a></li>
                    <li><a href="###" >特步</a></li>
                </ul>
                <h3>女装</h3>
                <ul>
                    <li><a href="###" >呢大衣</a></li>
                    <li><a href="###" >T恤</a></li>
                    <li><a href="###" >羽绒</a></li>
                    <li><a href="###" >衬衫</a></li>
                    <li><a href="###" >羊绒衫</a></li>
                    <li><a href="###" >针织</a></li>
                    <li><a href="###" >连衣裙</a></li>
                    <li><a href="###" >皮外套</a></li>
                </ul>
                <h3>男装</h3>
                <ul>
                    <li><a href="###" >衬衫</a></li>
                    <li><a href="###" >T恤衫</a></li>
                    <li><a href="###" >夹克</a></li>
                    <li><a href="###" >大皮衣</a></li>
                    <li><a href="###" >风衣</a></li>
                    <li><a href="###" >牛仔裤</a></li>
                    <li><a href="###" >西服</a></li>
                    <li><a href="###" >卫衣</a></li>
                </ul>
                <h3>鞋包配饰</h3>
                <ul>
                    <li><a href="###" >围巾</a></li>
                    <li><a href="###" >旅行箱</a></li>
                    <li><a href="###" >真皮包</a></li>
                    <li><a href="###" >韩版</a></li>
                    <li><a href="###" >达芙妮</a></li>
                    <li><a href="###" >单肩包</a></li>
                    <li><a href="###" >毛线</a></li>
                    <li><a href="###" >清仓靴子</a></li>
                </ul>

            </div>


        </div>
        <div id="content-right">
            <div id="content-center">
                <a href="###" class="img-list">
                    <img src="images/ads/1.jpg" alt="相约情人节" class="show-img" >
                    <img src="images/ads/2.jpg" alt="新款上线">
                    <img src="images/ads/3.jpg" alt="愤怒小鸟特卖">
                    <img src="images/ads/4.jpg" alt="男鞋促销第一波">
                    <img src="images/ads/5.jpg" alt="春季新品发布">
                </a>

                <div class="pic-msg">
                    <a href="###1" ><em>相约情人节</em><em>全场119元起</em></a>
                    <a href="###2"><em>新款上线</em><em>全场357元起</em></a>
                    <a href="###3"><em>愤怒小鸟特卖</em><em>全场89元</em></a>
                    <a href="###4"><em>男鞋促销第一波</em><em>全场3.1折起</em></a>
                    <a href="###5"><em>春季新品发布</em><em>全场4.1折起</em></a>
                </div>
            </div>
            <div id="content-side">
                <a href="###" class="side-img"><img src="images/upload/20120216.jpg" alt="冬季清仓"></a>
                <div class="side-text">
                    <h3>最新动态</h3>
                    <ul>
                        <li><a href="###1" class="tooltip" title="[活动] 伊伴春鞋迎春大促">[活动] 伊伴春鞋迎春大促</a></li>
                        <li><a href="###2" class="tooltip" title="[活动] 千百度冬靴新品火热让利">[活动] 千百度冬靴新品火热让利</a></li>
                        <li><a href="###3" class="tooltip" title="[活动] COEY秋冬新品全场2.3折起">[活动] COEY秋冬新品全场2.3折起</a></li>
                        <li><a href="###4" class="tooltip" title="[活动] 伊伴春鞋迎春大促">[活动] 伊伴春鞋迎春大促</a></li>
                        <li><a href="###5" class="tooltip" title="[活动] 千百度冬靴新品火热让利">[活动] 千百度冬靴新品火热让利</a></li>
                        <li><a href="###6" class="tooltip" title="[活动] COEY秋冬新品全场2.3折起">[活动] COEY秋冬新品全场2.3折起</a></li>
                    </ul>
                </div>
            </div>
            <div id="content-bottom">
                <div id="content-bottom-table">
                    <h2 class="title">品牌活动</h2>
                    <ul class="list">
                        <li class="member "><a href="###" class="items ">运动</a></li>
                        <li class="member"><a href="###" class="items">女鞋</a></li>
                        <li class="member"><a href="###" class="items">男鞋</a></li>
                        <li class="member"><a href="###" class="items">童鞋</a></li>
                    </ul>
                </div>
                <div id="content-bottom-goods">
                    <ul class="goods-list">
                        <li><img src="images/upload/20120217.jpg" alt=""><span class="items"><a href="###">耐克</a></span></li>
                        <li><img src="images/upload/20120218.jpg" alt=""><span class="items"><a href="###">阿迪达斯</a></span></li>
                        <li><img src="images/upload/20120219.png" alt=""><span class="items"><a href="###">李宁</a></span></li>
                        <li><img src="images/upload/20120220.png" alt=""><span class="items"><a href="###">安踏</a></span></li>

                        <li><img src="images/upload/20120217.jpg" alt=""><span class="items"><a href="###">耐克</a></span></li>
                        <li><img src="images/upload/20120218.jpg" alt=""><span class="items"><a href="###">阿迪达斯</a></span></li>
                        <li><img src="images/upload/20120219.png" alt=""><span class="items"><a href="###">李宁</a></span></li>
                        <li><img src="images/upload/20120220.png" alt=""><span class="items"><a href="###">安踏</a></span></li>

                        <li><img src="images/upload/20120217.jpg" alt=""><span class="items"><a href="###">耐克</a></span></li>
                        <li><img src="images/upload/20120218.jpg" alt=""><span class="items"><a href="###">阿迪达斯</a></span></li>
                        <li><img src="images/upload/20120219.png" alt=""><span class="items"><a href="###">李宁</a></span></li>
                        <li><img src="images/upload/20120220.png" alt=""><span class="items"><a href="###">安踏</a></span></li>

                        <li><img src="images/upload/20120217.jpg" alt=""><span class="items"><a href="###">耐克</a></span></li>
                        <li><img src="images/upload/20120218.jpg" alt=""><span class="items"><a href="###">阿迪达斯</a></span></li>
                        <li><img src="images/upload/20120219.png" alt=""><span class="items"><a href="###">李宁</a></span></li>
                        <li><img src="images/upload/20120220.png" alt=""><span class="items"><a href="###">安踏</a></span></li>


                    </ul>
                </div>
            </div>
        </div>
    </div>
    <footer id="footer">
        <div id="footer-message">Copyright @ 2018 阿龙哟</div>
    </footer>
</body>
</html>